<template>
<div class="loading-view">

  <div class="loading-icon">
    <img :src="LoadingImg" alt="">
  </div>
  <div class="loading-text">
    <img :src="WaitingImg" alt="">
  </div>
</div>
</template>
<script setup lang="ts">
import WaitingImg from "@/assets/imgs/waiting.png";
import LoadingImg from '@/assets/imgs/loading.gif';
</script>
<style scoped>
.loading-view {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  padding: 20px;
  border-radius: 5px;

  display: flex;




  .loading-text,.loading-icon {
    align-content: center;
  }


}

</style>
